﻿<%@ Page Title="用户中心" Language="C#" MasterPageFile="~/Home/Public/Home.Master" AutoEventWireup="true" CodeBehind="UserCenter.aspx.cs" Inherits="VIKI.Web.Home.UserCenter.UserCenter" %>

<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server">
    <link rel="stylesheet" type="text/css" href='<%=ResolveUrl("~/Home/Resources/Css/user_new.css")%>' />
</asp:Content>

<asp:Content ID="MainRightContent" ContentPlaceHolderID="MainRightContent" runat="server">
    <!--帐户信息 开始-->
    <form id="UserCenterForm" runat="server">
        <div class="zh">
            <div class="rightTitle">
                <h2><span class="clr-1"></span>个人中心</h2>
            </div>
            <script type="text/javascript">
                function changeTab(obj, index){
                    $(".tab-item").removeClass("tab-item-active");
                    $(obj).addClass("tab-item-active");
                    for(var i=1; i<5; i++){
                        if(index == i){
                            $("#tab" + i).show();
                        }else{
                            $("#tab" + i).hide();
                        }
                    }
                }
            </script>
            <table class="tab-box">
                <tr>
                    <td class="tab-item tab-item-active" onclick="changeTab(this, 1)">账户概览</td>
                    <td class="tab-block"></td>
                    <td class="tab-item" onclick="changeTab(this, 2)">学习进度</td>
                    <td class="tab-block"></td>
                    <td class="tab-item" onclick="changeTab(this, 3)">个人资料</td>
                    <td class="tab-block"></td>
                    <td class="tab-item" onclick="changeTab(this, 4)">修改密码</td>
                </tr>
            </table>
            <div id="tab1" class="user_zh">
                <ul>
                    <li>我们提供以下几种价格方案，您目前剩余:</li>
                    <li>
                        <table style="width: 680px; margin: 10px 0px; border: 1px">
                            <tbody>
                                <tr>
                                    <th>次卡</th>
                                    <td>
                                        <p style="float: left;">
                                            <span class="user_sj">1</span> 张
                          &nbsp;
                          有效期至 <span class="user_sj" style="height: 20px;">2015年04月27日</span>
                                        </p>
                                        <input type="button" class="orgbtn" value="购买次卡" style="margin-right: 10px; float: right;" onclick="" /></td>
                                </tr>
                                <tr>
                                    <th>日卡</th>
                                    <td>
                                        <p style="float: left;"><span class="user_sj">0</span> 张 </p>
                                        <input type="button" class="orgbtn" value="购买日卡" style="margin-right: 10px; float: right;" onclick="" /></td>
                                </tr>
                                <tr>
                                    <th>月卡</th>
                                    <td>
                                        <p style="float: left;"><span class="user_sj">0</span> 张 </p>
                                        <input type="button" class="orgbtn" value="购买月卡" style="margin-right: 10px; float: right;" onclick="" /></td>
                                </tr>
                                <tr>
                                    <th>年卡</th>
                                    <td>
                                        <p style="float: left;">
                                            <span class="user_sj">1</span> 张
                          &nbsp;
                          有效期至 <span class="user_sj" style="height: 20px;">2014年02月27日</span>
                                        </p>
                                        <input type="button" class="orgbtn" value="续费年卡" style="margin-right: 10px; float: right;" onclick="" /></td>
                                </tr>
                            </tbody>
                        </table>
                    </li>
                </ul>
            </div>
            <div id="tab2" class="user_zh" style="display: none">
                <ul>
                    <li>您目前已经上过以下课程，课程进度为：</li>
                    <li>
                        <table style="width: 680px; margin: 10px 0px; border: 1px">
                            <tbody>
                                <tr>
                                    <th>雅思</th>
                                    <td>
                                        <p style="float: left;">已上<span class="span-block">2</span> 节，共 <span class="span-block">20</span> 节，完成度 <span class="user_sj">10%</span></p>
                                        <div style="float: right; margin-right: 10px;">
                                            <input type="button" class="orgbtn" value="继续上课" onclick="window.location.href=&quot;purchase.php&quot;" />
                                            <input type="button" class="orgbtn" value="结束课程" onclick="window.location.href=&quot;purchase.php&quot;" />
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <th>托福</th>
                                    <td>
                                        <p style="float: left;">

                                            <p style="float: left;">已上<span class="span-block">11</span> 节，共 <span class="span-block">25</span> 节，完成度 <span class="user_sj">44%</span></p>
                                            <div style="float: right; margin-right: 10px;">
                                                <input type="button" class="orgbtn" value="继续上课" onclick="window.location.href=&quot;purchase.php&quot;" />
                                                <input type="button" class="orgbtn" value="结束课程" onclick="window.location.href=&quot;purchase.php&quot;" />
                                            </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </li>
                    <li>
                        <input type="button" value="学习新课程" onclick="" class="redbtn" />
                    </li>
                </ul>
            </div>
            <div id="tab3" class="user_zh" style="display: none">
                <ul>
                    <li>
                        <table style="width: 680px; margin: 10px 0px; border: 1px">
                            <tbody>
                                <tr>
                                    <th>邮箱</th>
                                    <td>
                                        <asp:TextBox runat="server" ID="UserEmail" CssClass="inp" Text='<%=id %>' />
                                    </td>
                                </tr>
                                <tr>
                                    <th>用户名</th>
                                    <td>
                                        <asp:TextBox runat="server" ID="UserName" CssClass="inp" Text="<%=user['UserId'] %>" />
                                    </td>
                                </tr>
                                <tr>
                                    <th>性别</th>
                                    <td>
                                        <asp:TextBox runat="server" ID="UserSex" CssClass="inp" Text="<%=user.UserSex %>" />
                                    </td>
                                </tr>
                                <tr>
                                    <th>生日</th>
                                    <td>
                                        <asp:TextBox runat="server" ID="TextBox2" CssClass="inp" Text="<%=user.UserSex %>" />
                                    </td>
                                </tr>
                                <tr>
                                    <th>联系方式</th>
                                    <td>
                                        <asp:TextBox runat="server" ID="UserTel" CssClass="inp" Text="<%=user.UserTel %>" />
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </li>
                    <li>
                        <input type="button" value="保存资料" onclick="" class="redbtn" style="margin-left: 100px;" />
                    </li>
                </ul>
            </div>
            <div id="tab4" class="user_zh" style="display: none">
                <ul>
                    <li>
                        <table style="width: 680px; margin: 10px 0px; border: 1px">
                            <tbody>
                                <tr>
                                    <th>原始密码</th>
                                    <td>
                                        <input type="password" class="inp" /></td>
                                </tr>
                                <tr>
                                    <th>新密码</th>
                                    <td>
                                        <input type="password" class="inp" /></td>
                                </tr>
                                <tr>
                                    <th>确认密码</th>
                                    <td>
                                        <input type="password" class="inp" /></td>
                                </tr>
                            </tbody>
                        </table>
                    </li>
                    <li>
                        <input type="button" value="修改密码" onclick="" class="redbtn" style="margin-left: 100px;" />
                    </li>
                </ul>
            </div>
        </div>
    </form>
    <!--帐户信息 结束-->
</asp:Content>
